(function(){
    //获取主界面
    var mainPanel=tools.$('mainPanel');
    //获取开始界面
    var startPanel=tools.$('startPanel');
    //获取开始按钮
    var startBtn=tools.$('startBtn');
    //获取重新开始按钮
    var resetBtn=tools.$('resetBtn');
    //获取最后得分标签
    var endScore=tools.$('endScore');
    //获取结束盒子
    var endDiv=tools.$('endDiv');
    //获取暂停盒子
    var pauseDiv=tools.$('pauseDiv');
    //左上角积分器
    var leftScore=tools.$('leftScore');
    //当前得分
    var score=0;
    //游戏状态
    var isRunning=false;
    //确定按钮
    var rankBtn=tools.$('rankBtn');
    //英雄留名
    var myname=tools.$('myname');
    //排行榜容器
    var rank=tools.$('rank');
    //排行榜表格
    var rankTab=tools.$('rankTab');
    tools.bind(rankBtn,'click',function(){
        tools.hide(endDiv);
        tools.show(rank);
        let ranklist=localStorage.getItem('ranklist') ? JSON.parse(localStorage.getItem('ranklist')):[];//获取排行榜
        ranklist.push({myname:myname.value,score});//存入
        ranklist.sort(function(a,b){//排序
            return b.score-a.score;
        })
        localStorage.setItem('ranklist',JSON.stringify(ranklist));
        let trs='';
        //最多显示前十名，否则放不下
        let len=ranklist.length>10?10:ranklist.length;
        for(let i=0;i<len;i++){
            let r=ranklist[i];
            trs+=`<tr><td>${i+1}</td><td>${r.myname}</td><td>${r.score}</td></tr>`
        }
        rankTab.innerHTML=trs;
    })

    tools.bind(resetBtn,'click',function(){
        location.reload();
    })


    //点击开始按钮，隐藏开始界面，显示主界面
    tools.bind(startBtn,'click',startGame);

    /**
     * 发射核弹
     */
    tools.bind(document.body,'keyup',function(e){
        if(e.keyCode==32){
            tools.$('bomb').play();
            //按下空格，发送核弹
            var w=20;
            var h=60;
            var x=(mainPanel.offsetWidth-w)/2;
            var y=(mainPanel.offsetHeight-h);
            var b=new Bomb(x,y,w,h,'img/boy.png');
            var timer=setInterval(function(){
                if(b.image.offsetTop<=mainPanel.offsetHeight/1.2){
                    clearInterval(timer);
                    mainPanel.removeChild(b.image);
                    b=null;
                    clearEnemy();
                }else{
                    b.move();
                }
            },50)
        }else if(e.keyCode==27){
            isRunning=!isRunning;
            //按下ESC，游戏暂停。再次按下，游戏继续
            if(isRunning){
                startGame();
                tools.hide(pauseDiv);
            }else{
                pause(pauseDiv);
            }
        }
    });

    /**
     * 清屏
     */
    function clearEnemy(){
        for(var i=0;i<enemys.length;i++){
            var em=enemys[i];
            em.image.src=em.boomImage; //切换到爆炸图片
            score+=em.score;//累计当前分数
            leftScore.innerHTML=score;//更新左上角的积分器
            em.isDie=true;//将此敌机标识为死亡
            em.deadTime=Date.now();//死亡时间为现在
        }
    }

    /**
     * 创建飞机构造函数
     * @param {X坐标} x 
     * @param {Y坐标} y 
     * @param {宽度} width 
     * @param {高度} height 
     * @param {图片地址} imgSrc 
     */
    function Plane(x,y,width,height,imgSrc,hp,score,speed,boomImage){
        this.x=x;
        this.y=y;
        this.width=width;
        this.height=height;
        this.hp=hp;//血量
        this.score=score;//飞机被击落得到的分数(不同敌机分数不同)
        this.speed=speed;//飞行速度(每个敌机给了不同的随机数)
        this.isDie=false;//是否死了(默认没死)
        this.deadTime;//死亡时间
        this.boomImage=boomImage;//飞机爆炸的图片
        this.init=function(){
            this.image=new Image(width,height);
            this.image.setAttribute('src',imgSrc);
            this.image.style.left=this.x+'px';
            this.image.style.top=this.y+'px';
            this.image.style.zIndex=999;
            mainPanel.appendChild(this.image);
        }
        //向下移动行为(给敌人使用)
        this.fly=function(){
            //可根据当前玩家的分数,适当调速
            this.image.style.top=this.image.offsetTop+this.speed+'px';
        }
        this.init();
    }

    /**
     * 我的飞机
     * @param {X坐标} x 
     * @param {Y坐标} y 
     */
    function OurPlane(x,y){
        Plane.call(this,x,y,66,80,'img/我的飞机.gif',100,0,0,'img/本方飞机爆炸.gif');
        this.Invincible=false;//无敌状态
        this.InvincibleTime=0;//无敌的开始时间
    }

    //创建一个我的飞机
    var me=new OurPlane(127,480);

    /**
     * 鼠标移动
     */
    function move(e){
        e =  window.event || e;
        var x=e.clientX;
        var y=e.clientY;
        //让飞机随着鼠标移动（鼠标始终保持在飞机的中间，所以要获取飞机宽高度的一半）
        var left=x-this.offsetLeft-me.image.offsetWidth/2;
        var top=y-this.offsetTop-me.image.offsetHeight/2;

        //边界处理
        left=Math.max(0,Math.min(left,this.offsetWidth-me.image.offsetWidth));
        top=Math.max(0,Math.min(top,this.offsetHeight-me.image.offsetHeight));

        me.image.style.left=left+'px';
        me.image.style.top=top+'px';
    }

    /**
     *  敌人
     * @param {开始坐标范围} a 
     * @param {结束坐标范围} b 
     * @param {宽度} width 
     * @param {高度} height 
     * @param {图片路径} imgSrc 
     */
    function Enemy(a,b,width,height,imgSrc,hp,score,speed,boomImage){
        var x=random(a,b);
        Plane.call(this,x,50,width,height,imgSrc,hp,score,speed,boomImage);
    }

    function random(min,max){
        return Math.floor(Math.random()*(max-min))+min;
    }

    /**
     *  子弹构造函数
     * @param {子弹X坐标} x 
     * @param {子弹Y坐标} y 
     * @param {子弹宽度} width 
     * @param {子弹高度} height 
     * @param {子弹图片} imgSrc 
     * @param {子弹旋转角度} rotate
     * @param {子弹发射方向(负数向左、正数向右)} moveDirection
     */
    function Bullet(x,y,rotate,moveDirection){
        this.x=x;
        this.y=y;
        this.moveDirection=moveDirection;//子弹发射水平方向(负数向左、正数向右)
        this.init=function(){
            this.image=new Image();
            this.image.style.left=x+'px';
            this.image.style.top=y+'px';
            this.image.style.transform='rotate('+rotate+'deg)';
            switch(this.bullet_level){
                case 1:this.bullet_level1();break;
                case 2:this.bullet_level2();break;
                case 3:this.bullet_level3();break;
            }
            //追加到mainPanel中
            mainPanel.appendChild(this.image);
        }
        this.init();
        this.move=function(){
            //子弹每次向上移动3像素
            this.image.style.top=this.image.offsetTop-3+'px';
            this.image.style.left=this.image.offsetLeft+this.moveDirection+'px';
        }
    }
    Bullet.prototype.bullet_level=1;
    Bullet.prototype.bullet_level1=function(){
        this.image.src='img/bullet1.png';
        this.image.style.width='6px';
        this.image.style.height='15px';
    }
    Bullet.prototype.bullet_level2=function(){
        this.image.src='img/bullet2.png';
        this.image.style.width='15px';
        this.image.style.height='30px';
        this.image.style.left=parseFloat(this.image.style.left)-5+'px';
    }
    Bullet.prototype.bullet_level3=function(){
        this.image.src='img/bullet3.png';
        this.image.style.width='25px';
        this.image.style.height='40px';
        this.image.style.left=parseFloat(this.image.style.left)-10+'px';
    }

    /**
     * 随机发放给玩家的礼物
     */
    function Gift(x,y,width,height,imgSrc,level){
        this.x=x;
        this.y=y;
        this.width=width;
        this.height=height;
        this.imgSrc=imgSrc;
        this.level=level;//礼物等级
        this.directionX=1;//1表示向右移动、-1表示向左移动
        this.init=function(){
            this.image=new Image(this.width,this.height);
            this.image.src=this.imgSrc;
            this.image.left=x+'px';
            this.image.top=y+'px';
            mainPanel.appendChild(this.image);
        }
        this.init();
        this.move=function(){
            this.image.style.top=this.image.offsetTop+1+'px';
            if(this.image.offsetLeft<=0){
                this.directionX=1;
            }else if(this.image.offsetLeft>=mainPanel.offsetWidth-this.image.offsetWidth){
                this.directionX=-1;
            }
            this.image.style.left=this.image.offsetLeft+this.directionX+'px';
        }
    }

    /**
     * 原子弹
     * @param {} x 
     * @param {*} y 
     * @param {*} width 
     * @param {*} height 
     * @param {*} imgSrc 
     */
    function Bomb(x,y,width,height,imgSrc){
        this.x=x;
        this.y=y;
        this.width=width;
        this.height=height;
        this.image=new Image(width,height);
        this.image.src=imgSrc;
        this.image.style.left=x+'px';
        this.image.style.top=y+'px';
        //追加到mainPanel中
        mainPanel.appendChild(this.image);
        this.move=function(){
            this.image.style.top=this.image.offsetTop-2+'px';
        }
    }


    var bullets=[];//存放所有的子弹对象

    /**
     * 添加子弹
     * @param {*} x 
     * @param {*} y 
     */
    function addBullet(){
        //创造子弹需要有一定的间隔时间,当mark1的数量达到10的倍数时创建一次子弹
        if(mark1%10==0){
            //子弹的位置应该在我方飞机的正前方水平居中,所以要根据我方飞机的位置计算得出
            var x=me.image.offsetLeft+me.image.offsetWidth/2;
            var y=me.image.offsetTop-10;
            //每次创建三发子弹(只需将坐标适当偏移即可)
            var a=new Bullet(x,y,0,0);
            var b=new Bullet(x-25,y+15,-10,-1);
            var c=new Bullet(x+25,y+15,10,1);
            bullets.push(a,b,c);
        }

        var bulletLen=bullets.length;
        // console.log('当前子弹数量：'+bulletLen);
        for(var i=0;i<bulletLen;i++){
            bullets[i].move();//子弹发射
            if(bullets[i].image.offsetTop<=-bullets[i].image.offsetHeight){
                //超出边界、移除子弹
                mainPanel.removeChild(bullets[i].image);
                //数组里也移除
                bullets.splice(i,1);
                bulletLen--;
            }
        }
    }
    var animationId;    //动画ID
    var BGY=0; //背景图Y轴坐标（0-568）循环
    var mark1=0;//mark1累计到50时开始创建敌人
    var mark2=0;//mark2根据数量不同来决定创建哪种敌人
    var enemys=[];//存放所有敌人对象
    
    
    /**
     * 主界面背景移动
     */
    function main(){
        mainPanel.style.backgroundPositionY=BGY+'px';
        BGY+=2;
        if(BGY===568){
            BGY=0;
        }
        createEnemy();//创建敌机与移动
        addBullet();//创建子弹与移动
        collision();//碰撞检测
        addGift();//礼物发放
        Invincible();//无敌检测
        console.log('Gift Length:'+gift_list.length);
        console.log('Enemy Length:'+enemys.length);
        console.log('Bullet Length:'+bullets.length);

    }


    function Invincible(){
        if(me.InvincibleTime+20000<Date.now()){
            //取消无敌状态
            me.Invincible=false;
            me.image.style.opacity=1;
        }
    }

    var gift_count=0;
    var gift_list=[];
    function addGift(){
        gift_count++;
        var x=random(0,mainPanel.offsetWidth);
        // var gifts=[{level:0,src:'live.png'}];
        var gifts=[{level:2,src:'green.png'},{level:3,src:'red.png'},{level:0,src:'live.png'}];
        //累加到1000时产生一个gift
        if(gift_count==1000){
            var gift=gifts[Math.floor(Math.random()*gifts.length)];
            gift_list.push(new Gift(x,0,20,20,'img/'+gift.src,gift.level));
            gift_count=0;
        }

        for(var i in gift_list){
            var gg=gift_list[i];
            //礼物移动
            gg.move();
            //飞离屏幕范围、删除该礼物
            if(gg.image.offsetTop>=mainPanel.offsetHeight){
                mainPanel.removeChild(gg.image);
                gift_list.splice(i,1);
            }

            //判断礼物是否与当前我方飞机发生碰撞
            if(gg.image.offsetLeft+gg.image.offsetWidth>=me.image.offsetLeft && gg.image.offsetLeft<=me.image.offsetLeft+me.image.offsetWidth){
                //纵向检测
                if(gg.image.offsetTop+gg.image.offsetHeight>=me.image.offsetTop&& gg.image.offsetTop<=me.image.offsetTop+me.image.offsetHeight){
                    //子弹变化
                    if(gg.level==2){
                        Bullet.prototype.bullet_level=2;
                    }else if(gg.level==3){
                        Bullet.prototype.bullet_level=3;
                    }else{
                        //无敌20秒
                        me.Invincible=true;
                        me.InvincibleTime=Date.now();
                        me.image.style.opacity=0.4;
                    }
                    //移除礼物
                    mainPanel.removeChild(gg.image);
                    gift_list.splice(i,1);
                }
            }
        }
    }

    /**
     * 碰撞检测（敌机与我机、敌机与我子弹）
     */
    function collision(){
        //遍历所有敌机
        for(var i=0;i<enemys.length;i++){
            //同时遍历所有子弹
            for(var j=0;j<bullets.length;j++){
                var em=enemys[i];
                var bb=bullets[j];
                //敌机与我机的碰撞检测
                if(!em.isDie){
                    //横向检测
                    if(em.image.offsetLeft+em.image.offsetWidth>=me.image.offsetLeft && em.image.offsetLeft<=me.image.offsetLeft+me.image.offsetWidth){
                        //纵向检测
                        if(em.image.offsetTop+em.image.offsetHeight>=me.image.offsetTop&& em.image.offsetTop<=me.image.offsetTop+me.image.offsetHeight){
                            //如果我方飞机是无敌状态，则对方爆炸。否则游戏结束
                            if(me.Invincible){
                                em.image.src=em.boomImage; //切换到爆炸图片
                                score+=em.score;//累计当前分数
                                leftScore.innerHTML=score;//更新左上角的积分器
                                em.isDie=true;//将此敌机标识为死亡
                                em.deadTime=Date.now();//死亡时间为现在
                            }else{
                                me.image.src='img/本方飞机爆炸.gif'
                                pause(endDiv);
                            }
                        }
                    }
                }

                //敌机与我子弹的碰撞检测
                if(em.image.offsetLeft+em.image.offsetWidth>=bb.image.offsetLeft && em.image.offsetLeft<=bb.image.offsetLeft+bb.image.offsetWidth){
                    //纵向检测
                    if(em.image.offsetTop+em.image.offsetHeight>=bb.image.offsetTop && em.image.offsetTop<=bb.image.offsetTop+bb.image.offsetHeight){
                        //敌人血量每次-1
                        em.hp-=1;
                        //这颗子弹移除
                        mainPanel.removeChild(bb.image);
                        //从子弹数组里也删除
                        bullets.splice(j,1);
                        //如果敌机的血量已经减为0，则该敌机标识死亡
                        if(em.hp==0){
                            em.image.src=em.boomImage; //切换到爆炸图片
                            score+=em.score;//累计当前分数
                            leftScore.innerHTML=score;//更新左上角的积分器
                            em.isDie=true;//将此敌机标识为死亡
                            em.deadTime=Date.now();//死亡时间为现在
                        }
                    }
                }
            }
        }
    }

    /**
     * 暂停游戏
     */
    function pause(panel){
        //统计分数
        endScore.innerHTML=score;
        //显示结束盒子
        tools.show(panel);
        //动画停止
        clearInterval(animationId);
        //移除事件
        tools.unbind(mainPanel,'mousemove',move);
        tools.$('bullet').pause();
        isRunning=false;
    }

    /**
     * 创建敌机
     */
    function createEnemy(){
        mark1++;
        if(mark1==20){
            mark2++;
            if(mark2%5==0){
                //中型敌人(所有创建出来的敌机都存储到enemys数组中)
                enemys.push(new Enemy(23, 274, 46, 60, 'img/enemy3_fly_1.png',5,500,random(1,3),'img/中飞机爆炸.gif'));
            }
            if(mark2%20==0){
                //大型敌人(所有创建出来的敌机都存储到enemys数组中)
                enemys.push(new Enemy(55, 210, 110, 164, 'img/enemy2_fly_1.png',10,1000,random(1,2),'img/大飞机爆炸.gif'));
            }else{
                //普通敌人(所有创建出来的敌机都存储到enemys数组中)             
                enemys.push(new Enemy(50, 200, 34, 24, 'img/enemy1_fly_1.png',1,100,random(1,4),'img/小飞机爆炸.gif'));
            }
            mark1=0;//创建完一个敌人后，归零等待下一次计数到50再创建
        }

        //敌机的移动
        var enemyLen=enemys.length;
        for(var i=0;i<enemyLen;i++){
            var e=enemys[i];
            if(!e.isDie){
                e.fly();//如果没死就开始向下移动
            }else{
                //如果飞机的死亡状态，则删除该元素(但是要延迟一会，否则看不到爆炸场面了~)
                if(e.deadTime+500<Date.now()){
                    mainPanel.removeChild(e.image);
                    enemys.splice(i,1);
                    enemyLen--;
                }
            }

            //如果敌机离开屏幕则立即清除，节约空间出来(飞机的top>=mainPanel高度的时候)
            var mainHeight=mainPanel.offsetHeight;
            if(e.image.offsetTop>=mainHeight){
                //从数组里将其删除
                enemys.splice(i,1);
                //页面上对应的IMG也删除
                e.image.remove?e.image.remove():e.imagae.removeNode(true);
                enemyLen--;
            }
        }
        // console.log("当前敌人数量："+enemyLen);
    }


    /**
     * 开始游戏（包含一些初始化设置）
     */
    function startGame(){
        tools.$('bgm').play();
        tools.$('bgm').volume=0.1;
        tools.$('bullet').play();
        tools.hide(startPanel);
        tools.show(mainPanel);
        isRunning=true;
        //给主界面绑定鼠标移动事件
        tools.bind(mainPanel,'mousemove',move);
        animationId=setInterval(main,15);
    }
})();